<template>
  <Modal class="w-[800px]">
    <!-- <Grid></Grid> -->
  </Modal>
</template>

<script setup lang="ts">
import { useVbenModal } from '@vben/common-ui';
import { useVbenVxeGrid, type VxeGridProps } from '#/adapter/vxe-table';
import { getcarList } from '#/api/core/car';
const [Modal] = useVbenModal({
  title: '车辆信息',
});

interface RowType {
  category: string;
  color: string;
  id: string;
  price: string;
  productName: string;
  releaseDate: string;
}

/**
 * 获取示例表格数据
 */
async function getExampleTableApi(params: {
  page: any;
  size: any;
  carplate?: any;
}) {
  console.log(params);
  return new Promise<{ items: any; total: number }>(async (resolve) => {
    const { page, size, carplate } = params;
    // const items = await getcarList({
    //   page,
    //   size,
    //   carplate,
    // });

    resolve({
      total: 0,
      items: [],
    });
  });
}
const gridOptions: VxeGridProps<RowType> = {
  checkboxConfig: {
    highlight: true,
    labelField: 'name',
  },
  pagerConfig: {
    pageSizes: [2, 20, 50],
  },
  columns: [
    { title: '序号', type: 'seq', width: 50 },

    {
      field: 'createdAt',
      formatter: 'formatDateTime',
      title: '创建时间',
      sortable: true,
    },
    {
      field: 'updatedAt',
      formatter: 'formatDateTime',
      title: '更新时间',
      sortable: true,
    },
    {
      field: 'action',
      fixed: 'right',
      slots: { default: 'action' },
      title: '操作',
    },
  ],
  exportConfig: {},
  // height: 'auto', // 如果设置为 auto，则必须确保存在父节点且不允许存在相邻元素，否则会出现高度闪动问题
  keepSource: true,
  proxyConfig: {
    ajax: {
      query: async ({ page }, formValues) => {
        return await getExampleTableApi({
          page: page.currentPage,
          size: page.pageSize,
          ...formValues,
        });
      },
    },
  },
  toolbarConfig: {
    custom: true,
    export: true,
    // import: true,
    refresh: true,
    zoom: true,
  },
};
const [Grid] = useVbenVxeGrid({
  gridOptions,
});
</script>

<style scoped></style>
